<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>AVD</title>
        <link rel="stylesheet" type="text/css" href="stylesheets/reset.css" />
        <link rel="stylesheet" type="text/css" href="stylesheets/style.css" />
        <script charset="utf-8" type="text/javascript" src="lib/jquery.js" ></script>
        <script charset="utf-8" type="text/javascript" src="scripts/ajax.js" ></script>
    </head>
    <body>
        <div id="wrap">
            <div id="panel" style="float: left; height: 50px; width: 100%;">
                <div style="margin: 10px;">
                    <span>User</span>
                    <input type="text" name="user" id="userLogin"/>

                    <span>password</span>
                    <input type="password" name="password" id="passwordLogin"/>

                    <input id="btnSubmit" type="button" onclick="login();" value="enter"/>
                </div>
            </div>

            <div id="header">
                <div id="logo"><img width="32px" src="images/virtualdisk.png" alt="" />
                    <h1>Another<br>Virtual Disk</h1>
                    <span>Sync your files</span>
                </div>
                <div style="float: right;">
                    <a href="#" id="btnLogin" class="open" onclick="openLogin();">
                        <img src="images/login-open.png" alt="open" />
                    </a>
                    <a href="#" id="btnRegister">
                        <img src="images/register.png" alt="register" />
                    </a>
                </div>

                <script type="text/javascript">
                    $(document).ready(function() {
                        $("#panel").hide();

                        $("#btnLogin").click(function() {
                            $("#panel").slideToggle("slow");
                        });
                        
                    });

                    function openLogin() {
                        var btnLogin = document.getElementById("btnLogin");

                        if (btnLogin.className == "open")
                        {
                            btnLogin.className = "close";
                            btnLogin.innerHTML = "<img src='images/login-close.png' alt='close' />";
                        }
                        else if (btnLogin.className == "close")
                        {
                            btnLogin.className = "open";
                            btnLogin.innerHTML = "<img src='images/login-open.png' alt='open' />";
                        }
                    }
                </script>

                <ul id="nav">
                    <li><a href="#">Home</a></li>
                    <li><a href="#">About us</a></li>
                    <li><a href="http://code.google.com/p/anothervirtualdisk/wiki/QtClient">Install</a></li>
                    <li class="last"><a href="#">Contact</a></li>
                </ul>
            </div>
            <!-- /header -->
            <div id="content">
                <div id="inner">
                    <%
                                String userSession = (String) session.getAttribute("user");

                                //if (userSession == null || userSession.equals("")) {
                    %>
                    <div class="left float-l">
                        <h2>Welcome</h2>
                        <p>
                            <img width="6px" src="images/item.png" alt=""/> Sync files of any size or type<br>
                                <img width="6px" src="images/item.png" alt=""/> Share large files and photos easily<br>
                                    <img width="6px" src="images/item.png" alt=""/> Automatic online backup<br>
                                        </p>
                                        </div>
                                        <div class="right folat-r">
                                            <div id="side">
                                                <a href=""><img width="100px" src="images/download.gif" alt=""/></a>
                                            </div>
                                        </div>

                                        <%                                            //} else {
                                        %>
                                        <script> //login(); </script>
                                        <%                                //}
                                        %>
                                        </div>
                                        </div>
                                        <!-- /content -->
                                        <div id="footer">
                                            <div class="ft">
                                                <div id="ftlink"> <a href="http://code.google.com/p/anothervirtualdisk/source/checkout">Source</a> |
                                                    <a href="http://code.google.com/p/anothervirtualdisk/wiki">Wiki</a> |
                                                    <a href="#">Help</a> |
                                                    <a href="#">Tour</a>
                                                </div>
                                                <p id="copyright">© 2009. All Rights Reserved. <b>Zumbits</b></p>
                                            </div>
                                        </div>
                                        <!-- /footer -->
                                        </div>
                                        </body>
                                        </html>
